<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<% 
	String context = request.getContextPath(); 
%>
<html>
<head>
    <title>发起流程</title>
    <link rel="stylesheet" href="<%=context %>/Source/lib/layui/css/layui.css">
</head>

<body style="padding: 0;overflow:hidden;">

    <form style="width: 40%;margin: 100px auto" id="form1" class="layui-form" action="">
        <input id="processId" type="hidden"/>
        <div class="layui-form-item">
            <label class="layui-form-label">流程</label>
            <div class="layui-input-block">
                <select id="process" name="processId" lay-verify="required">
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">应用</label>
            <div class="layui-input-block">
                <select id="app" name="appId" lay-verify="required">
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-block">
                <input id="remark" lay-verify="required" placeholder="请输入标题" name="remark" type="text" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn layui-btn-normal" lay-submit lay-filter="formDemo">发起</button>
            </div>
        </div>
    </form>
    <div >
</div>
</body>
<script src="<%=context %>/gooflow/jquery.min.js"></script>
<script src="<%=context %>/microcore/commonjs/utility.js"></script>
<script src="<%=context %>/Source/lib/layui/layui.js"></script>
<script type="text/javascript">

    	var path = '<%=context %>';
        var _path = path+"/flow/task/start";
        var process = ${process};
        var apps = ${apps};			//TODO:要远程调用 @RequestMapping("/app") 这个接口 来获取app列表数据

        $(function () {
            //加载 process下拉选
        	$("#process").empty();
            $("#process").append('<option value="">--请选择--</option>');
            $.each(process,function(index,obj){
                // debugger
          	  $("#process").append('<option value="'+obj.processKey+'">'+obj.processName+'</option>');
            });

            //加载 app下拉选
            $("#app").empty();
            $("#app").append('<option value="">--请选择--</option>');
            $.each(apps,function(index,obj){
                $("#app").append('<option value="'+obj.appId+'">'+obj.appName+'</option>');
            });

        });

        layui.use('form', function(){
            var form = layui.form;

            //监听提交
            form.on('submit(formDemo)', function(data){
                var proInstance = data.field;

                app.ajax({
                    url: _path,
                    data: proInstance,
                    success: function (result) {
                        if(result.isError){
                            layer.msg(result.message);
                        }else{
                            layer.msg(result.message);
                        }
                    }
                })

                return false;
            });
        });
    </script>
</html>
